<template>
  <el-dialog
    :visible="dialogVisible"
    :close-on-click-modal="false"
    title="任务填报"
    width="60%"
    top="5%"
    :before-close="cancelClose"
  >
    <el-form :inline="true" label-width="100px">
      <el-form-item label="指标名称：">
        <el-input
          v-model="indexName"
          clearable
          @input="getTableData(rowData.id)"
          placeholder="请输入指标名称"
        ></el-input>
      </el-form-item>
    </el-form>
    <Table
      :tableData="fillTable"
      height="50vh"
      :loading="loading"
      :tabtitle="tabtitle"
      :showPagination="false"
    >
      <el-table-column align="center" label="操作" v-if="!onlyLook">
        <template slot-scope="scope">
          <el-button
            type="text"
            @click="writeData(scope.row)"
            :disabled="scope.row.isFill != '1'"
            >去填报</el-button
          >
        </template>
      </el-table-column>
    </Table>
  </el-dialog>
</template>

<script>
import Table from '@/components/Table.vue'
import { findMeetingTaskVo } from '@/apis/taskList.js'
import { getDetailByAccountOrId, getUserInfo, getSelf } from '@/apis/Common.js'
import { getRealToken } from '@/utils/util'

export default {
  components: {
    Table
  },
  data() {
    return {
      fillTable: [],
      indexName: '',
      dialogVisible: false,
      loading: false,
      rowData: {},
      onlyLook: false,
      tabtitle: [
        { prop: 'indexName', label: '指标名称' },
        { prop: 'reportName', label: '大屏名称' },
        {
          prop: 'planState',
          label: '计划完成状态',
          render: (h, scope) => {
            return h(
              'div',
              {
                attrs: {
                  class: scope.row.planState
                    ? scope.row.planState === '1'
                      ? 'type-normal'
                      : 'type-warning'
                    : ''
                }
              },
              scope.row.planStateDesc
            )
          }
        },
        {
          prop: 'state',
          label: '实际完成状态',
          render: (h, scope) => {
            return h(
              'div',
              {
                attrs: {
                  class: scope.row.state
                    ? scope.row.state === '1'
                      ? 'type-normal'
                      : 'type-warning'
                    : ''
                }
              },
              scope.row.stateDesc
            )
          }
        }
      ]
    }
  },
  mounted() {
    this.getUserRole()
  },
  methods: {
    async getUserRole() {
      try {
        const accessObj = getRealToken()
        const isCheckOut = accessObj?.isCheckOut
        let res = null
        if (isCheckOut) {
          const resInfo = await getSelf()
          res = await getUserInfo(resInfo.tenantId)
        } else {
          res = await getDetailByAccountOrId({
            account: sessionStorage.getItem('currentUser')
              ? JSON.parse(sessionStorage.getItem('currentUser')).account
              : null
          })
        }
        if (res?.role?.roleCode?.length > 0) {
          const roleCode = res.role.roleCode.split('|')
          const arr = roleCode
            .map((roleCode) =>
              ['hygczmkcy-gcy', 'hygczmkjt-gcy'].indexOf(roleCode)
            )
            .filter((index) => index !== -1)
          if (arr.length > 0) {
            this.onlyLook = true
          } else {
            this.onlyLook = false
          }
        } else {
          this.onlyLook = true
        }
      } catch (error) {
        this.onlyLook = true
      }
    },
    async getTableData(meetingId) {
      this.loading = true
      let res = await findMeetingTaskVo({
        meetingId,
        indexName: this.indexName
      })
      if (res.code === 200) {
        this.fillTable = res.data
      }
      this.loading = false
    },
    cancelClose() {
      this.dialogVisible = false
      this.indexName = ''
    },
    writeData(row) {
      row.url?.length > 0
        ? window.open(row.url)
        : this.$message.warning('暂无填报地址，请配置后再填报！')
    },
    show(row) {
      this.rowData = row
      this.dialogVisible = true
      this.getTableData(row.id)
    }
  }
}
</script>

<style></style>
